<template>
	<div class="app-container">
		<table>
			<tr>
				<th colspan="5" class="c-textAlign-l padding-l10">收入情况统计</th>
			</tr>
			<tr>
				<th>公司净收入</th>
				<th>奖学金</th>
				<th>今日收入</th>
				<th>本周收入</th>
				<th>本月收入</th>
			</tr>
			<tr v-loading="loading">
				<td><b @click="linkToCompanyIncome">{{data.company.allIncomes}}</b></td>
				<td>{{data.company.burse}}</td>
				<td>{{data.company.today}}</td>
				<td>{{data.company.week}}</td>
				<td>{{data.company.month}}</td>
			</tr>
		</table>
		<table>
			<tr>
				<th colspan="9" class="c-textAlign-l padding-l10">会员数量统计</th>
			</tr>
			<tr>
				<th>会员总数</th>
				<th>VIP</th>
				<th>SVIP</th>
				<th v-if="this.agentLevel > 0 ">代理商</th>
				<th v-if="this.agentLevel > 1 ">合伙人</th>
				<th v-if="this.agentLevel > 1 ">分公司</th>
				<th>今日新增总数</th>
				<th>本周总数</th>
				<th>本月总数</th>
			</tr>
			<tr v-loading="loading">
				<td>{{data.members.num}}</td>
				<td>{{data.members.vip}}</td>
				<td>{{data.members.svip}}</td>
				<td v-if="this.agentLevel > 0 ">{{data.members.agent}}</td>
				<td v-if="this.agentLevel > 1 ">{{data.members.partner}}</td>
				<td v-if="this.agentLevel > 1 ">{{data.members.branch}}</td>
				<td>{{data.members.today}}</td>
				<td>{{data.members.week}}</td>
				<td>{{data.members.month}}</td>
			</tr>
		</table>
		<table>
			<tr>
				<th colspan="5" class="c-textAlign-l padding-l10">订单数量统计</th>
			</tr>
			<tr>
				<th>总订单数</th>
				<th>今日订单数</th>
				<th>本周订单数</th>
				<th>本月订单数</th>
			</tr>
			<tr v-loading="loading">
				<td>{{data.orders.num}}</td>
				<td>{{data.orders.today}}</td>
				<td>{{data.orders.week}}</td>
				<td>{{data.orders.month}}</td>
			</tr>
		</table>
	</div>
</template>
<script>
import { business } from '@/api/finance'
import { getAgentLevels } from '@/utils/permission'
export default {
  data() {
    return {
      data: {
        members: [],
        company: [],
        orders: [],
        agentLevel: 0
      },
      loading: false
    }
  },
  created() {
    this.getList()
    this.agentLevel = getAgentLevels()
  },
  methods: {
    getList() {
      this.loading = true
      business().then(res => {
        this.data = res.data.data
        this.loading = false
      }).catch(err => {
        console.log(err)
      })
    },
    linkToCompanyIncome() {
      this.$router.push({ path: '/financed/companyIncome' })
    }
  }
}
</script>
<style scoped>
	a:hover{
		color: #0A76A4;
	}
	table,tr,td,th{
		border: 1px solid #ddd;
		border-collapse: collapse;
		border-spacing: 0;
		text-align: center;
	}
	th{
    background-color: rgb(245, 247, 250);
    color: rgb(92, 96, 101);
	}
	table{
		font-size: 14px;
		color: #333;
		width: 100%;
		line-height: 36px;
		margin-bottom: 20px;
	}
</style>
